<template>
  <div class="search-container">
    <sec-form
      :span="6"
      :searchBox="{ span: 6 }"
      :optionData="optionData"
      :formData="formData"
      :ruleForm.sync="ruleForm"
      ref="searchForm"
      @submitForm="searchHandle"
      @reset="searchHandle"
    ></sec-form>
  </div>
</template>

<script>
import { getFeModelCfgList, getSearchConditionValue, batchGetSearchConditionValueApi } from "api/riskCenterApi";
export default {
  name: "secDySearchBar",
  props: {
    type: {
      type: String,
      require: true,
    },
    source: {
      type: String,
      require: true,
    },
  },
  components: {},
  data() {
    return {
      extraParams: {}, //需要级联的
      optionData: {},
      ruleForm: {},
      formData: [],
    };
  },
  computed: {},
  mounted() {
    console.log(this.type);
  },
  methods: {
    async initPage() {
      this.extraParams = {}; //初始化关联数据
      let loading = this.openLoading();
      await this.initFieldModelCfgList(); //获取搜索条件配置数据
      loading.close();
      this.batchGetSearchConditionOptions(); //批量获取 下拉选项数据
    },
    //operateType 0-查询操作；1-添加操作；2(表格头 list), 3治理
    async initFieldModelCfgList(operateType = 0) {
      await getFeModelCfgList({ type: this.type, source: this.source, operateType }).then((res) => {
        console.log(res);
        let data = res.data;
        this.formData = data?.map((item) => {
          this.$set(this.ruleForm, item.property, "");
          let obj = { type: item.searchFormType, label: item.comment, prop: item.property, filterable: true, ...item };
          //关联的数据 需要模糊查询 (其他的通过批量「batchGetSearchConditionValueApi」获取下拉数据)
          if (item.relSearchFlag) {
            this.$set(this.extraParams, item.property, item.property); //需要级联
            return {
              ...obj,
              focus: () => {
                let query = this.ruleForm[item.property] || "";
                this.filterMethodHandle(query, item.property);
              },
              filterMethod: (query) => {
                this.filterMethodHandle(query, item.property);
              },
            };
          }
          //默认的情况 直接获取他的下拉选项
          return obj;
        });
      });
    },
    batchGetSearchConditionOptions() {
      this.getConditionType(); //获取能下拉选项的字段（没有关联的字段）
      batchGetSearchConditionValueApi({
        type: this.type,
        source: this.source,
        conditionTypes: this.conditionTypes,
      }).then((res) => {
        console.log(res);
        this.optionData = res.data;
      });
    },
    getConditionType() {
      this.conditionTypes = [];
      this.formData.forEach((item) => {
        !item.relSearchFlag && this.conditionTypes.push(item.property);
      });
    },
    filterMethodHandle(query, property) {
      console.log(this.ruleForm);
      this.ruleForm[property] = query;
      const params = {
        type: this.type,
        source: this.source,
        conditionType: property,
        // status: this.statusMap[this.activeName],
        extraParams: {},
      };
      for (let key in this.extraParams) {
        params.extraParams[key] = this.ruleForm[key];
      }
      getSearchConditionValue(params).then((res) => {
        let data = res.data;
        this.$set(this.optionData, property, data);
      });
    },
    searchHandle() {
      this.$emit("submitForm", this.ruleForm);
    },
  },
  watch: {},
};
</script>
<style lang="scss" scoped>
//@import url(); 引入公共css类
</style>
